<!DOCTYPE html>
<html>
<head lang="en">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta charset="utf-8">
    <meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, width=device-width">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta name="format-detection" content="telephone=no">
    <meta content="telephone=no" name="format-detection">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>{$title}</title>
    <!-- <script src="http://sdk.talkingdata.com/app/h5/v1?appid=DE13C350F41F5DE78FEC51DB5DE730D1&vn=v2&vc=v2"></script> -->
    <link rel="stylesheet" href="{$Think.config.RESOURCEURL}wx_assets/css/common.css{$Think.config.RESOURCE_VER}" onerror="_cdnFallback(this)">
    <script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/zepto.1.1.3.min.js{$Think.config.RESOURCE_VER}"></script>
    <script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/zepto.alert.js{$Think.config.RESOURCE_VER}"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
    <script type="text/javascript" src="{$Think.config.RESOURCEURL}wx_assets/js/wx_share.js{$Think.config.RESOURCE_VER}"></script>
    <script src="{$Think.config.RESOURCEURL}wx_assets/js/util.js{$Think.config.RESOURCE_VER}" type="text/javascript"></script>
    <style>
        body{
            background-color: #f5f5f5;
        }
        .container{
            max-width: 640px;
            margin: 0 auto;
            background-color:white;
        }
        .container_top a{
            display:block;
            font-size:0;
            text-align: center;
        }
        .container_top a img{
            max-width:100%;
        }
        .container_main{
            margin:10px 0;
        }
        .container_main a{
            display:inline-block;
            width:50%;
            vertical-align: top;
            font-size:0;
            text-align: center;
            padding:0 1% 5px;
            box-sizing:border-box;
            position:relative;
        }
        .container_main a span{
            font-size: 16px;
            font-weight: 600;
        }
        .container_main a img{
            max-width:100%;
        }
        .middle{
            -webkit-transform: translate(-50%,-50%);
            position:absolute;
            top:50%;
            left:50%;
            transform:translate(0,-50%);
        }
    </style>
</head>
<body>
    <div class="container">
        <div class="container_top">
            <volist name="MainArticles" id="main">
                <a href="{$main.url}">
                    <img src="{$main.picurl}"/>
                </a>
            </volist>
        </div>
        <div class="container_main">
            <volist name="ModuleArticles" id="module">
                <a href="{$module['url']}">
                    <img src="{$module['picurl'][0]}" />
                    <span class="middle" style="color:{$module['color'][0]}">{$module['title'][0]}</span>
                </a>
            </volist>

        </div>

    </div>
</body>
<script>

    wx_share.init({
        "title":"{$title}",
        "desc":'{$shareinfo}',
        "link":window.location.href,
        "imgUrl": '{$sharepicurl}',
        "pkg":{
            "appId": '{$pkg.appId}',
            "timestamp": '{$pkg.timestamp}',
            "nonceStr": '{$pkg.nonceStr}',
            "signature": '{$pkg.signature}'
        },
        success:function(config,shareType){

        }
    });
</script>
</html>